<template>
  <div class="addressParse">
    <van-popup v-model="show" @close="onClose" round position="bottom" :style="{ Height: '40vh' }">
      <van-nav-bar title="自动填写地址" left-arrow @click-left="onClose" />
      <div class="contenBox">
        <textarea name="text" cols="30" rows="10" class="textareaBox" v-model="address" placeholder="  示例:张三,1232123122,广东省XXXXX"></textarea>
        <div class="tips">请输入详细收货地址，并按照示例格式填写</div>
      </div>
      <div class="btn" @click="toPostMethod">智能填充</div>
    </van-popup>
  </div>
</template>
<script>
import{Toast} from "vant"
export default {
  props: {
    //弹窗是否显示，默认不显示
    show: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
        address:''
    };
  },
  watch:{
    show:function(newv,oldv){
        if(newv){
            this.address = '';
        }
    }
  },
  methods: {
    onClose() {
      this.$emit("address_parseClose");
    },
    toPostMethod() {
        $http.post("plugin.address-parse.frontend.index", {address:this.address}, "获取中").then(
        (response)=> {
          if (response.result === 1) {
            this.$emit('toPostMethod',response.data)
          } else {
            Toast(response.msg);
          }
        },
        function(response) {
          console.log(response);
        }
      );
    }
  }
};
</script>
<style lang="scss" rel="stylesheet/scss" scoped>
.btn {
  margin: 2rem 2rem 1rem 2rem;
  background: #f15353;
  padding: 0.8rem 0;
  text-align: center;
  border-radius: 0.1563rem;
  color: #fff;
}

.contenBox {
  width: 100%;
  padding: 0 0.9375rem;

  .textareaBox {
    width: 100%;
    max-height: 6rem;
    border: #bbb 1px solid;
  }

  .tips {
    color: #828282;
    text-align: left;
    font-size: 11px;
  }
}
</style>